import QtQuick
import FluentUI
import QtQuick.Controls

// 评测报告
FluRectangle {
    radius: [25, 25, 25, 25]
    width: mainWindow.width * 0.26
    height: mainWindow.height * 0.35
    color: "#FFFFFF"

    Text {
        x: 25
        y: parent.height * 0.03
        text: "评测报告"
        font.pointSize: 9 * fontSizeFactor
        font.family: "MiSans"
        font.weight: Font.DemiBold
        color: "#0A1629"
    }

    Column {
        anchors.fill: parent
        // 占位
        Rectangle {
            width: parent.width
            height: parent.height * 0.15
            color: "transparent"
        }
        FluRectangle {
            width: parent.width
            height: parent.height * 0.8
            color: "transparent"

            FluChart {
                width: parent.width
                height: parent.height
                chartType: "doughnut"
                chartData: { return {
                    labels: [
                        '正确',
                        '模糊',
                        '错误',
                    ],
                    datasets: [{
                        data: [80, 10, 7],
                        backgroundColor: [
                            '#3F8CFF',
                            '#FFD023',
                            '#F65160'
                        ],
                        hoverOffset: 3
                    }]
                }
                }
                chartOptions: { return {
                    maintainAspectRatio: false,
                    tooltips: {
                        mode: 'index',
                        intersect: false
                    }
                }
                }

                Component.onCompleted: {
                    parent.widthChanged.connect(updateSize);
                    parent.heightChanged.connect(updateSize);
                }

                function updateSize() {
                    width = parent.parent.width;
                    height = parent.parent.height * 0.8;
                }
            }
        }
    }
}
